<script setup>
import { showSuccessMsg } from "./../../../utils/msg.js"
const props = defineProps({
  data: {
    type: Object,
    default: () => {
      return {}
    }
  },
  callback: {
	  type: Function,
	  default: () => {}
  },
  qianshouFun: {
	  type: Function,
	  default: () => {}
  }
})

</script>

<template>
  <view class="order-item-com-box" @click="callback(data.leftText1)">
		<view class="top-box">
			<view class="order_sn-box">
			  <view class="label">配送数量: </view>
			  <view class="order_sn">{{data.peisong_count}}瓶</view>
			</view>
			<view class="status-btn">
				<view class="status" v-if="data.status == '0'" :style="data.statusStyle">{{data.statusText}}</view>
				<view class="status" v-if="data.status == '1'" :style="data.statusStyle">{{data.statusText}}: {{data.qianshou_count}}瓶</view>
			</view>
		</view>
		<view class="center-box">
			<view class="address">
				地址: {{data.xiangzhen}}/{{data.xuexiao}}
			</view>
			<view class="name-phone">
				联系: {{data.name}}-<text>{{data.phone}}</text>
			</view>
			<!-- <view class="qianshou_count">
				已签收: {{data.qianshou_count}}
			</view> -->
			
		</view>
		<view class="bottom-box">
			<view class="label">{{data.createtime}}</view>
			<view v-if="data.status == '0'" class="qianshou-btn" @click.stop="qianshouFun(data)">
				签收
			</view>
		</view>
  </view>
</template>

<style lang="scss" scoped>
.order-item-com-box {
	width: 630rpx;
	.top-box{
		@include flex(row,space-between,center);
		.order_sn-box{
			flex-grow: 1;
			@include flex(row,flex-start,center);
			@include ellipse();
		}
		.status{
			
		}
	}
	.center-box{
		padding: 30rpx 0;
		
		.address{
			margin-bottom: 30rpx;
		}
		
		.address,.name-phone{
			display: flex;
			width: 100%;
		}
		
		.qianshou_count{
			margin-top: 30rpx;
		}
	}
	.bottom-box{
		@include flex(row,space-between,center);
		padding-top: 30rpx;
		border-top: 1px solid var(--borderColor);
		
		.label{
			font-size: 26rpx;
		}
		
		.qianshou-btn{
			background-color: var(--mainColor);
			color: #fff;
			border-radius: 6rpx;
			padding: 10rpx 30rpx;
		}
	}
}
</style>
